<template>
  <van-form @submit="onSubmit">
    <van-row justify="center">
      <van-image
          width="343"
          :src= campusImage
          style="background-position:center"
      />
    </van-row>
    <van-cell-group inset>
      <van-field
          v-model="userAccount"
          name="userAccount"
          label="用户名"
          placeholder="账号"
          :rules="[{ required: true, message: '请填写账号' }]"
      />
      <van-field
          v-model="userPassword"
          type="password"
          name="userPassword"
          label="密码"
          placeholder="密码"
          :rules="[{ required: true, message: '请填写密码' }]"
      />
    </van-cell-group>
    <span style="right: 22px;position: fixed;font-size: 12px;color: #3c89fc;text-decoration: underline"
          @click="toForget">忘记密码?</span>
    <div style="margin: 16px;">
      <van-button round block type="primary" native-type="submit">
        提交
      </van-button>
      <van-button round block type="danger" native-type="submit" to="/user/signup">
        注册
      </van-button>
    </div>
  </van-form>

</template>

<script setup lang="ts">
import {ref} from 'vue';
import myAxios from "../../plugins/myAxios";
import {useRoute, useRouter} from "vue-router";
import {Toast} from "@vant/compat";
import campusImage from "../../assets/patient.png"

const route=useRoute();
const router=useRouter();
const userAccount=ref('');
const userPassword=ref('');
const onSubmit = async () => {
  // console.log("用户登录");
  const res = await myAxios.post("/user/login", {
    userAccount: userAccount.value,
    userPassword: userPassword.value
  });
  if (res.code == 0 && res.data != null) {
    Toast.success("登录成功");
    const redirectUrl=route.query?.redirect as string??'/';
    window.location.href=redirectUrl;
  } else {
    Toast.fail("登录失败");
  }
};
const toForget = () => {
  router.push("/forget")
}

</script>

<style scoped>

</style>